﻿
@{
    Layout = null;
    ViewBag.Title = "Index";
}
<html>
    <head>
        <meta charset="utf-8" />
        <title>超级新星选拔首页</title>
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
        <link href="~/weui/style/weui.css" rel="stylesheet" />
        <link href="~/weui/style/weui2.css" rel="stylesheet" />
        <link href="~/weui/style/weui3.css" rel="stylesheet" />
        <script src="~/weui/zepto.min.js"></script>
        <script src="~/weui/swipe.js"></script>
        <style>
            .menu-item{
                background-color:#cb418e;
            }
            .weui-menu-inner-img{
                padding: 3px 0 0 0;
                height: 24px;
                width: 24px;
                color: #fff;
                line-height: 48px;
                vertical-align: middle;
            }
            .home {
                max-width: 70px
            }

                #sou {
                    height: 66px;
                    width: 66px;
                    margin: auto;
                    border-radius: 60px;
                    position: relative;
                    top: -17px;
                    /*background: ur*/l(http://wx.hu-wo.com/addons/fm_photosvote/static/mobile/stylebase/images/hb1.png?1497880878) no-repeat center center;
                    background-size: 100% 100%;
                }
            #sou:hover, #sou:active {
                background-color: none;
            }

            .weui-menu-inner-label {
                overflow: hidden;
                margin: 1px 0 0 0;
                display: block !important;
                line-height: 18px;
                text-align: center;
                color: #fff;
                font-size: 15px;
                letter-spacing: .07em
            }                
            .menu_font_img {
                width: 20px;
                height: 20px;
                display: inline-block;
                margin-top: 3px;                
                line-height: 40px;
                vertical-align: middle;
            }
            .menu_font_label {
                padding: 3px 0 0 3px;
                overflow: hidden;
                margin: 0;
                color: #fff;
            }
        </style>
        <script>
            $(function () {
                $('#slide2').swipeSlide({
                    autoSwipe: true,//自动切换默认是
                    speed: 3000,//速度默认4000
                    continuousScroll: true,//默认否
                    transitionType: 'cubic-bezier(0.22, 0.69, 0.72, 0.88)',//过渡动画linear/ease/ease-in/ease-out/ease-in-out/cubic-bezier
                    lazyLoad: true,//懒加载默认否
                    firstCallback: function (i, sum, me) {
                        me.find('.dot').children().first().addClass('cur');
                    },
                    callback: function (i, sum, me) {
                        me.find('.dot').children().eq(i).addClass('cur').siblings().removeClass('cur');
                    }
                });
                $('.weui-menu-inner').click(function () {
                    var $menu = $(this).find('ul'),
                        height = $menu.find('li').length * 40 + 15 + 'px',
                        opacity = $menu.css('opacity');

                    $('.weui-menu-inner ul').css({
                        'top': '0',
                        'opacity': '0',
                        'right':'5px'
                    });

                    if (opacity == 0) {
                        $menu.css({
                            'top': '-' + height,
                            'opacity': 1
                        });
                    } else {
                        $menu.css({
                            'top': 0,
                            'opacity': 0
                        });
                    }
                });
            });
        </script>
    </head>
    <body>
        <div class="page-hd">
            <div class="slide" id="slide2">
                <ul>
                    <li>
                        <a href="#">
                            <img src="~/images/SuperStar/微信图片_20170617184244.jpg" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="~/images/SuperStar/微信图片_20170617184343.jpg" />
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="~/images/SuperStar/微信图片_20170617184328.jpg" />
                        </a>
                    </li>
                </ul>
                <div class="dot">
                    <span></span>
                    <span></span>
                    <span></span>
                </div>
            </div>

            <section class="weui-menu menu-item">
                <div class="weui-menu-inner">
                    @*<img src="~/images/SuperStar/home.png" />*@
                    <a href="#">
                        <img class="weui-menu-inner-img" src="~/images/SuperStar/home.png" />
                        <label class="weui-menu-inner-label">首页</label>
                    </a>
                </div>
                <div class="weui-menu-inner">
                    <a href="#">
                        <img class="weui-menu-inner-img" src="~/images/SuperStar/my.png" />
                        <label class="weui-menu-inner-label">报名</label>
                    </a>
                </div>
                <div class="weui-menu-inner">
                    <img id="sou" src="~/images/SuperStar/hb1.png" />
                </div>
                <div class="weui-menu-inner">
                    <a href="#">
                        <img class="weui-menu-inner-img" src="~/images/SuperStar/rank.png" />
                        <label class="weui-menu-inner-label">排行</label>
                    </a>
                </div>
                <div class="weui-menu-inner">
                    <img class="weui-menu-inner-img" src="~/images/SuperStar/more.png" />
                    <label class="weui-menu-inner-label">更多</label>
                    <ul>                        
                        <li style="background:#524945">
                            <a href="#">
                                <img class="menu_font_img" src="~/images/SuperStar/xiangqing.png" />
                                <label class="menu_font_label">活动详情</label>
                            </a>
                        </li>
                        <li style="background:#524945">
                            <a href="#">
                                <img class="menu_font_img" src="~/images/SuperStar/me.png" />
                                <label class="menu_font_label">个人中心</label>
                            </a>
                        </li>
                    </ul>
                </div>
            </section>
        </div>
    </body>
</html>

